<template>
    <h2>跟踪记录</h2>
    <el-icon :size="100"><Van /></el-icon><br><span>合同编号：{{he.contractNumber}}</span><br>
    <span>收货地址：{{use.endAddress}}({{use.endCity}})</span>
 
  <div style="height: 300px; max-width: 600px">
 <el-steps direction="vertical" :active="1">
   <el-step title="" />  【{{use.endCity}}】货物已在【{{ use. endAddress}}】签收
<br>
签收人：{{use.cargoOwnerName}}<br>
您的货物已经妥投，感谢在本次合作中的支持，期待再次为您服务.
<br>
{{he.createdDate}}
        <el-step title="" />
     【{{use.endCity}}】货物已送达【{{ use. endAddress}}】
<br>
车牌号：A88888<br>  
{{he.createdDate}}



   <el-step title="" />
     【{{use.startingProvince}}】货物已在【{{ use.startingPointAddress }}】    
 提货 <br>
 车牌号：A88888<br>  
 {{he.createdDate}}

   <el-step title="合同已审批"/> 
    承运商：{{he.unit}}<br>
经办人{{he.personCharge}}<br> 
{{he.createdDate}}<br>
 <el-step title="合同已创建"  />
承运商：{{he.unit}}<br>
经办人{{he.personCharge}}<br> 
{{he.createdDate}}<br>

 </el-steps>
</div>
</template>
 
<script setup lang='ts'>
import axios from 'axios';
import { Van} from '@element-plus/icons-vue'
import {  ref } from 'vue'
import{useRouter,useRoute} from 'vue-router'
const route = useRoute()
console.log(route.query.linenames)
console.log(route.query.id)
import { onMounted } from 'vue';
onMounted(()=>{
  baskefill()
  basehe()

})
console.log(localStorage.getItem("Phone"))
const use=ref([])
const baskefill = () =>{
 axios.get("/bread/api/Lines/GetByLine", {
       params: {
     LineName: route.query.linenames
   }
 }).then((res) => {

   use.value = res.data.data[0]
   console.log(use.value)

  
 }
)
}
const he=ref({})
const basehe = () =>{
axios.get('/hread/api/ContractRead/BackfillTshowContract', {
     params: {
       ContractId: route.query.id
     }
   }).then(res => {
he.value = res.data.data
console.log(res.data.data)
})
}

</script> 
 